<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no" />
		<meta name="format-detection" content="telephone=no" />
		<script>
			var html = document.getElementsByTagName('html')[0];
			html.style.fontSize = html.clientWidth / 3.75 + "px";
		</script>
		<title>编辑店铺</title>
		<link rel="stylesheet" href="../static/css/Reset.css">
		<link rel="stylesheet" href="../static/css/editShop.css" />
	</head>
	<body style="background:#EFEEEC;">
		<script type="text/x-template" id="main">
			<div class="conter">
				<div class="top">
					<img-uploader :opt="opt" :img="image" @file-added="fileSelected" @file-uploaded="fileUploaded">
					    <div :style="{background:bannerImg}">{{bannerImg}}</div>
					    <div class="upload-mask" v-show="image.percent>0 && image.percent<100">{{image.percent}}%</div>
					</img-uploader>
				</div>
				<ul class="info">
					<li>
						<span class="left">店铺名称</span>
						<input class="right" placeholder="必填，2〜8个字" v-with-clear-btn v-model="info.farmInfo.name"> 
					</li>
					<router-link to="/setAddress" tag="li">
						<span class="left">店铺地址</span>
						<span class="right rights" v-text=" !(info.farmInfo.area && info.farmInfo.address) ? '请选择店铺地址' : info.farmInfo.area+info.farmInfo.address"></span>
					</router-link>
					<li>
						<span class="left">电话</span>
						<input class="right" v-with-clear-btn v-model="info.farmInfo.telephone" >
					</li>

					<li @click="showOverlay=true">
						<span class="left">店铺性质</span>
						<span class="right rights" v-text="!shopType ? '请选择' : shopType"></span>
					</li>
					<li @click="setIDCard">
						<span class="left">实名认证</span>
						<span class="right rights" v-text="!checkStatus? '未认证' : checkStatus"></span>
					</li>
					<li @click="setBankCard">
						<span class="left">结算账户</span>
						<span class="right rights"></span>
					</li>
					<li>
						<span class="left">种植作物</span>
						<input class="right" v-with-clear-btn v-model="info.farmInfo.crop" placeholder="未知">
					</li>
					<li>
						<span class="left">种植面积</span>
						<input class="right" v-with-clear-btn v-model="info.farmInfo.acreage" placeholder="200亩">
					</li>
				</ul>
				<div class="btn" @click="saveFarmInfo">
					确定
				</div>
				<!--</a>-->

				<transition name="fade">
					<div class="overlays" @click="showOverlay=false" v-show="showOverlay"></div>					
				</transition>
				<transition name="slideUp">
					<ul class="zhezhao" v-show="showOverlay">
						<li @click="setShopType(0)">个人农庄</li>
						<div class="bor"></div>
						<li @click="setShopType(1)">企业农庄</li>
					</ul>
				</transition>
				<loading v-show="showLoading"></loading>
			</div>
		</script>

		<script type="text/x-template" id="setIDCard">
			<div class="smrz">
				<ul class="info">
					<li>
						<span class="left">经营者姓名</span>
						<input class="right" v-with-clear-btn v-model="idcardInfo.realName" placeholder="请填写经营者姓名"></span>
					</li>
					<li>
						<span class="left">身份证号码</span>
						<input class="right" v-with-clear-btn v-model="idcardInfo.idNumber" placeholder="请填写身份证号码"></span>
					</li>
				</ul>
				<div class="item">
					<div class="item_left">
						<p class="mt">手持身份证照</p>
						<p class="ys">需要上传手持身份证照</p>
					</div>
					<div class="item_right">
						<img-uploader class="sfbtn" :opt="opt" :img="photoWithPerson" @file-added="fileSelected" @file-uploaded="fileUploaded">
							<div :style="{background:getThumb(photoWithPerson.thumb)}">
								<span v-show="!photoWithPerson.result" class="jia">+</span>
								<div class="upload-mask" v-show="photoWithPerson.percent>0 && photoWithPerson.percent<100">{{photoWithPerson.percent}}%</div>
							</div>
						</img-uploader>
					</div>
				</div>
				<div class="item">
					<div class="item_left w14">
						<p class="mt">身份证正反面照</p>
						<p class="ys">需要上传正反面照</p>
					</div>
					<div class="item_right w23">
						<img-uploader class="sfbtn" :opt="opt" :img="photoBack" @file-added="fileSelected" @file-uploaded="fileUploaded">
							<div :style="{background:getThumb(photoBack.thumb)}">
								<span v-show="!photoBack.result" class="jia">+</span>
								<div class="upload-mask" v-show="photoBack.percent>0 && photoBack.percent<100">{{photoBack.percent}}%</div>
							</div>
						</img-uploader>
						<img-uploader class="sfbtn" :opt="opt" :img="photoFront" @file-added="fileSelected" @file-uploaded="fileUploaded">
							<div :style="{background:getThumb(photoFront.thumb)}">
								<span v-show="!photoFront.result" class="jia">+</span>
								<div class="upload-mask" v-show="photoFront.percent>0 && photoFront.percent<100">{{photoFront.percent}}%</div>
							</div>
						</img-uploader>
					</div>
				</div>
				<div class="bzbtn" @click="saveIDCard">提交</div>
				<loading v-show="showLoading"></loading>
			</div>
		</script>

		<script type="text/x-template" id="setCompanyBank">
			<div class="companyuser">
				<div>
					<ul class="info ts">
						<li>
							<span class="left">企业名称</span>
							<input class="right" v-with-clear-btn v-model="bankCardInfo.realName" placeholder="请输入企业名称">
						</li>
						<li>
							<span class="left">发卡行</span>
							<span class="right" v-text="bankCardInfo.bankName" @click="showBankSelector=true" style="margin-right: 0.37rem;"></span>
						</li>
						<li>
							<span class="left">开户支行</span>
							<input class="right" v-with-clear-btn v-model="bankCardInfo.bankNameBranch" placeholder="请输入开户支行名称">
						</li>
						<li>
							<span class="left">银行卡账号</span>
							<input class="right" v-with-clear-btn v-model="bankCardInfo.cardPan" placeholder="请输入银行卡帐号">
						</li>
					</ul>
					<div class="item">
						<div class="item_left w14">
							<p class="mt">开户许可证</p>
						</div>
						<div class="item_right w23">
							<img-uploader class="sfbtn" :opt="opt" :img="bankLicence" @file-added="fileSelected" @file-uploaded="fileUploaded">
								<div :style="{background:getThumb(bankLicence.thumb)}">
									<span v-show="!bankLicence.result" class="jia">+</span>
									<div class="upload-mask" v-show="bankLicence.percent>0 && bankLicence.percent<100">{{bankLicence.percent}}%</div>
								</div>
							</img-uploader>
						</div>
					</div>
					<div class="text_sm">
						备注：结算账户提交后不可修改，如需要修改，请联系社员网客服:4000000
					</div>
					<div class="bzbtn" @click="save">保存</div>
				</div>

				<transition name="slideUp">
					<div class="bank-selector" v-show="showBankSelector">
						<div class="bank-selector-header"><span>请选择发卡银行</span><img @click="showBankSelector=false" src="../static/images/close-area.png"></div>
						<ul class="info bank-selector-list">
							<li v-for="x in bankList" class="bank-selector-item" :class="{active:x.code==bankCardInfo.bankCode}" @click="selectBank(x)">{{x.name}}</li>
						</ul>
					</div>
				</transition>
				<loading v-show="showLoading"></loading>
			</div>
		</script>

		<script type="text/x-template" id="setPersonalBank">
			<div class="personuser">
				<div>
					<ul class="info ts">
						<li>
							<span class="left">持卡人</span>
							<input class="right" v-with-clear-btn v-model="bankCardInfo.realName" placeholder="请输入持卡人姓名" name="">
						</li>
						<li>
							<span class="left">银行卡账号</span>
							<input class="right" v-with-clear-btn v-model="bankCardInfo.cardPan" placeholder="请输入银行卡帐号">
						</li>
						<li>
							<span class="left">发卡行</span>
							<span class="right" v-text="bankCardInfo.bankName" @click="showBankSelector=true" style="margin-right: 0.37rem;"></span>
						</li>
						<li>
							<span class="left">办卡预留手机号</span>
							<input class="right" v-with-clear-btn v-model="bankCardInfo.mobile" placeholder="请输入办卡预留手机号">
						</li>
						<li>
							<span class="left">手机验证码<input v-with-clear-btn v-model="checkCode" class="telInput" style="width: 1.7rem;"></span>
							<span class="getTel" @click="nextStep">获取验证码</span>
						</li>
					</ul>
					<div class="bzbtn m35" @click="save">提交</div>
				</div>

				<transition name="slideUp">
					<div class="bank-selector" v-show="showBankSelector">
						<div class="bank-selector-header"><span>请选择发卡银行</span><img @click="showBankSelector=false" src="../static/images/close-area.png"></div>
						<ul class="info bank-selector-list">
							<li v-for="x in bankList" class="bank-selector-item" :class="{active:x.code==bankCardInfo.bankCode}" @click="selectBank(x)">{{x.name}}</li>
						</ul>
					</div>
				</transition>
				<loading v-show="showLoading"></loading>
			</div>
		</script>

		<script type="text/x-template" id="BankCardInfo">
			<div class="bdsc" transition="slideLeft">
				<div class="banklist">
					<div class="bank_rq">
						<p class="names">{{bankCardInfo.realName}}</p>
						<p class="banks"><span>****</span><span>****</span><span>****</span><span class="kh" v-text="bankCardInfo.cardPan.slice(-4)"></span></p>
						<p class="yhl" v-text="bankCardInfo.bankName"></p>
					</div>
				</div>
				<div class="text_sm">
					备注：结算账户提交后不可修改，如需要修改，请联系社员网客服:4000000
				</div>
				<div class="bzbtn disabled">编辑</div>
				<loading v-show="showLoading"></loading>
			</div>
		</script>

		<script type="text/x-template" id="setAddress">
			<!--地址-->
			<div class="address">
				<ul class="info ts">
					<li @click="pickRegion()">
						<span class="left">所在区域</span>
						<span class="right-arrow"><img src="../static/images/go.png"/></span>
						<input type="text" class="right" name="pcdAddress" placeholder="省 > 市 > 区/县" readonly="readonly" :value="selectedRegion.areaName"/>
					</li>
					<li>
						<span class="left">详细地址</span>
						<input type="text" class="right" v-with-clear-btn placeholder="请输入详细地址" v-model="info.farmInfo.address"/>
					</li>
				</ul>
				<div class="detailAddress">当前定位：<span v-text="detailAddress"></span></div>
				<!--地图-->
				<div id="mapContainer" class="map"></div>
				<img class="position" src="../static/images/centerIcon.png" />
				<div class="btnAddress" @click="save" >保存</div>
				
				<transition name="slideUp">
					<div class="bank-selector" v-show="showRegionSelector">
						<div class="bank-selector-header"><span>请选择{{step[nowLevel]}}</span><img @click="showRegionSelector=false" src="../static/images/close-area.png"></div>
						<ul class="info bank-selector-list">
							<li v-for="x in areaData" class="bank-selector-item"
								@click="selectRegion(x)">{{x.areaName}}</li>
						</ul>
					</div>
				</transition>
				<loading v-show="showLoading"></loading>
			</div>
		</script>


		<div id="app">
			<transition :name="animation">
				<router-view></router-view>				
			</transition>
		</div>
	</body>
	<script src="https://api.map.baidu.com/api?v=2.0&ak=1BiZDIdoRV9iryDNcdF4oU37pqwftOin&s=1"></script>
	<script src="http://developer.baidu.com/map/jsdemo/demo/convertor.js"></script>
	<script type="text/javascript" src="../libs/jquery.min.js"></script>
	<script type="text/javascript" src="../libs/iosSelect.js"></script>
	<script type="text/javascript" src="../libs/fastclick.min.js"></script>
	<script type="text/javascript" src="../libs/vue2/vue.js"></script>
	<script type="text/javascript" src="../libs/vue2/vue-router.js"></script>
	<script type="text/javascript" src="../libs/vue/vue-resource.min.js"></script>
	<script type="text/javascript" src="../libs/require.js"></script>
	<script type="text/javascript" src="../libs/var.js"></script>
	<script type="text/javascript" src="../libs/common.js"></script>
	<script type="text/javascript" src="js/editShop.js"></script>
	<script type="text/javascript" src="../libs/var_compenentsr.js"></script>
</html>

